<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<script type="text/javascript" src="http://o.aolcdn.com/dojo/1.3.0/dojo/dojo.xd.js"></script>
	<title>Chat Room</title>
</head>
<body>
<h1>Chat room</h1>
<script type="text/javascript">
	var message_count = 0;
	function send_data() {
		var kw = {
			url : "/chat/post",
			form : "theform"
		};
		dojo.xhrPost(kw);
		dojo.byId("message").value="";
		return false;
	}
	function read_data() {
		dojo.xhrGet( {
			url: "/chat/get/" + message_count,
			timeout: 10000,
			handleAs: "text",
			load: function(response, ioArgs) {
				dojo.byId("messages").innerHTML = response + '<br/>' + dojo.byId("messages").innerHTML;
				message_count++;
				read_data();
				return response;
			},
			error: function(response,ioArgs) {
				read_data();
				return response;
			}

		});
	}
	dojo.addOnLoad(read_data);
</script>
<form id="theform" >
	<input id="message" type="text" name="message" value="" />
	<input type="submit" value="Send" onclick="return send_data()"/>
</form>
<div id="messages">
</div>
</body>
